lib.use(['element', 'table', 'form','treetable','jquery','tablePlug'], function () {
    var table = layui.table;
    var layer = layui.layer;
    var form = layui.form;
    var $ = layui.jquery;
    var treetable = layui.treetable;
    // 渲染表格
    var renderTable = function () {
        treetable.render({
            treeColIndex: 1,//树形图标显示在第几列
            treeSpid: 0,//最上级的父级id
            treeIdName: 'id',//id字段的名称
            treePidName: 'parentId',//pid字段的名称
            treeDefaultClose: true,//是否默认折叠
            treeLinkage: false,//父级展开时是否自动展开所有子级
            elem: '#menuTable',
            url: common.util.createUrl('/sys/menu/list'),
            page: false,
            cols: [[
                //  {type:'checkbox'},
                {type: 'numbers', title: '编号'},
                {field: 'name', title: '资源名称',width: 200,minWidth: 100},
                {field: 'url', title: '资源路径',width: 500, templet: function (row) {
                        if(row.url&&row.url!=null){
                            return row.url
                        }
                        if(row.perms&&row.perms!=null){
                            return row.perms;
                        }
                        return "";
                    }
                 },
                {field: 'orderNum', title: '排序',width: 80,},
                {
                    field: 'type', title: '类型', width: 80, templet: function (row) {
                        return common.dist.getValue("sys.Menu_TypeEnum", row.type);
                    }
                },{
                    field: 'isSystem', title: '系统菜单', width: 80, templet: function (row) {
                        return common.dist.getValue("comm.ValidEnum", row.isSystem);
                    }
                },
                {
                    field: 'id',fixed: 'right', title: '操作', width: 140, templet: function (row) {
                        return '<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">修改</a>' +
                            '<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>';
                    }
                }
            ]],
            done: function () {
                layer.closeAll('loading');
            }
        });

        //监听单元格事件
        table.on('tool(menuTableFilter)', function (obj) {
            if (obj.event === 'edit') {
                location.href = 'menuForm.html?id=' + obj.data.id;
            }
            if (obj.event === 'del') {
                del(obj);
            }
        });
    };
    renderTable();
    $(document).on('click','#add',function(){
        location.href = 'menuForm.html';
    });
    form.on('submit(searchFilter)', function(data){
        var param = data.field;
        searchTable(param)
        return false;
    });


    /**
     * 查询表格
     * @param params
     */
    function searchTable(params) {
        var keyword = params.menuName
        var searchCount = 0;
        $('#menuTable').next('.treeTable').find('.layui-table-body tbody tr td').each(function () {
            $(this).css('background-color', 'transparent');
            var text = $(this).text();
            if (keyword != '' && text.indexOf(keyword) >= 0) {
                $(this).css('background-color', 'rgba(250,230,160,0.5)');
                if (searchCount == 0) {
                    treetable.expandAll('#menuTable');
                    $('html,body').stop(true);
                    $('html,body').animate({scrollTop: $(this).offset().top - 150}, 500);
                }
                searchCount++;
            }
        });
        if (keyword == '') {
            layer.msg("请输入搜索内容", {icon: 5});
        } else if (searchCount == 0) {
            layer.msg("没有匹配结果", {icon: 5});
        }
    }

    /**
     * 删除
     * @param obj
     */
    function del(obj) {
        var menuId = obj.data.id;
        layer.confirm('真的删除吗', function(index){
            console.log('Menu Del param is', menuId);
            common.ajax.post('/sys/menu/delete/'+menuId, {}, function (resp) {
                renderTable();
                layer.close(index);
            })
        });
    }
});
